import Vue from "vue";

import App from "./App.vue";
import VueRouter from "vue-router";

import Home from "./views/Home.vue";
import Cart from "./views/Cart.vue";
import Shop from "./views/Shop.vue";
import NotFound from "./views/NotFound.vue";

/*
  1. 注册了组件 router-link 和 router-view
  2. 通过根配置项router，给所有的vue组件注入了对象$route和$router
  */
Vue.use(VueRouter);
/*
  1. 创建路由对象，设置路径（hash）和组件对象的映射关系
  2. 在根对象中配置router选项
*/
const router = new VueRouter({
  routes: [
    {
      // http://localhost:8080/#/a/100/user/20
      //  #/a/100/user/20
      path: "/a/:id/user/:uid",
      component: Home,
    },
    {
      // http://localhost:8080/#/a/b/e?name=jack&age=20
      path: "/a/b/e",
      component: Shop,
    },
    {
      path: "/a/b/f",
      component: Cart,
    },
    // {
    //   // 匹配 /useranc /user-456
    //   path: "/user*",
    //   component: NotFound,
    // },
    {
      // 匹配一切，不能写在路由表的第一条
      path: "*",
      component: NotFound,
    },
  ],
});

new Vue({
  el: "#app",
  router,
  render: (h) => h(App),
});
